import React, {useState, useEffect, useCallback} from 'react';
import {getSysUserFindDptUser} from '../../../../../../Api/listUrl';
import {getSofPlanTransPlan} from '../../../../../../Api/productionUrl'
import { Modal, Form, Select, message } from 'antd';
const { Option } = Select;

const ChangeTaskModal = ({ changeTaskModalShow, setChangeTaskModalShow, taskId, listFun }) => {
    const [form] = Form.useForm();
    const {validateFields, resetFields } = form;
    const [userList, setUserList] = useState([]);
    const [confirmLoading, setConfirmLoading] = useState(false);
    const userFun = useCallback(
        () => {
            ;(async () => {
                const {code, msg, data} = await getSysUserFindDptUser();
                if(code === '20000') {
                    setUserList(data);
                }else{  
                    message.error(msg);
                }
            })();
        },
        [],
    )
    useEffect(() => {
        userFun();
    }, [userFun])
    const handleOk = () => {
        validateFields().then(values => {
            setConfirmLoading(true)
            values.taskId = taskId;
            ;(async () => {
                const {code, msg} = await getSofPlanTransPlan(values);
                if(code === '20000'){
                    message.success('转让成功')
                    resetFields();
                    listFun();
                    setConfirmLoading(false);
                    setChangeTaskModalShow(false);
                    
                }else{
                    message.error(msg);
                }
            })();
        })
        
    };

    const handleCancel = () => {
        resetFields()
        setChangeTaskModalShow(false);
    };
    return <Modal title="转派任务" visible={changeTaskModalShow} onOk={handleOk} onCancel={handleCancel} confirmLoading = {confirmLoading}>
        <Form
            {...layout}
            form={form}
        >
            <Form.Item
                label="选择人员"
                name="userId"
                rules={[{ required: true, message: '请选择转派人员!' }]}
            >
                <Select>
                    {
                        userList.map(item => <Option key = {item.id} value={item.id}>{item.name}</Option>)
                    }
                </Select>
            </Form.Item>
        </Form>
    </Modal>
}
const layout = {
    labelCol: { span: 8 },
    wrapperCol: { span: 16 },
};

export default ChangeTaskModal;